﻿@model DrillOnline.Services.DrillScenarios

@{
    ViewBag.Title = "CtrlPanel";
    var ds = Model;
}

@section scripts {

    <script src="~/Scripts/jquery.signalR-2.0.0.min.js"></script>
    <script src="~/Scripts/jquery-ui-1.10.3.js"></script>
    <script src="~/Scripts/arttemplate.js"></script>

    <script src="~/signalr/hubs"></script>

    <script type="text/javascript">
        
        $(function () {

            var scenario = $.connection.drillEventHub;

            scenario.client.PushMessage = function (datetimeNow, stringUser, stringGroup, datetimeScenariosTime, stringMessage,mt,eid) {
                if(mt=="submit"){
                    showMessage(datetimeNow, stringUser , stringMessage,eid);
                }
            };
            scenario.client.StatusChange = function (Now, IsReady, Status) {
                updateStatus(Now,IsReady,Status);
            }
            scenario.client.PlayIndexChange=function(Now,ST,PO,SortIndex,Offset){
                updatePlayIndex(Now,ST,PO,SortIndex,Offset);
            }
            $.connection.hub.start().done(function () {
                updateStatus(null, @(Model.IsReady ? "true" : "false"), @(Model.Timeline.Status));
                try{
                    updatePlayIndex('@(DateTime.Now.ToUniversalTime())','@(Model.Timeline.StoryBaseTime.AddSeconds(Model.Timeline.PlayingOffset).ToUniversalTime())',@(Model.Timeline.PlayingOffset),@(Model.SceneList[Model.Timeline.PlayingSceneIndex].Model.SortIndex) ,null);
                }catch(e){
                }
                
            });


            $("#events .button a").click(function(){
                var src=$(this);
                
                var data={eventid:src.closest("table").attr("data-eventid"),values:src.attr("data-vp"),valuetitle:src.text()};
                //                var result = new { cv = value, ct = valuetitle, vc0 = vc0, vc1 = vc1, vc2 = vc2, vp0 = Math.Round(vc0 * 100d / tc, 0).ToString(), vp1 = Math.Round(vc1 * 100d / tc, 0).ToString(), vp2 = Math.Round(vc2 * 100d / tc, 0).ToString() };
                $.getJSON('@Url.Action("CtrlPanel")',data,function(result){
                    src.closest("table").find(".replypoint").text(result.ct);
                    $("#Summary").text("无效"+result.vc0+"个，占"+result.vp0+"%； 合格"+result.vc1+"个，占"+result.vp1+"%；优秀"+result.vc2+"个，占"+result.vp2+"%；共答复"+result.rc+"个；");
                });

            });

            $("#events .button a").click(function(){
                var src=$(this);
                
                var data={eventid:src.closest("table").attr("data-eventid"),values:src.attr("data-vp"),valuetitle:src.text()};
                //                var result = new { cv = value, ct = valuetitle, vc0 = vc0, vc1 = vc1, vc2 = vc2, vp0 = Math.Round(vc0 * 100d / tc, 0).ToString(), vp1 = Math.Round(vc1 * 100d / tc, 0).ToString(), vp2 = Math.Round(vc2 * 100d / tc, 0).ToString() };
                $.getJSON('@Url.Action("CtrlPanel")',data,function(result){
                    src.closest("table").find(".replypoint").text(result.ct);
                    $("#Summary").text("无效"+result.vc0+"个，占"+result.vp0+"%； 合格"+result.vc1+"个，占"+result.vp1+"%；优秀"+result.vc2+"个，占"+result.vp2+"%；共答复"+result.rc+"个；");
                });

                        });
        });

        function updatePlayIndex(Now,ST,PO,SortIndex,Offset){
            var e = $("div#events #e" + SortIndex);
            $("div#events .ce").removeClass("ce");
            e.addClass("ce");
            //var nt=e.offset().top-e.parent().offset().top-16;

            //$("#events").parent().animate({ scrollTop: nt }, 1000);
                    
            
            $("#prop_crt").text(new Date(Date.parse( Now)).toLocaleString());
            $("#prop_cst").text(new Date(Date.parse(ST)).toLocaleString());
            var po=new Date(PO*1000);
            $("#prop_et").text(""+(po.getDate()-1)+"天"+(po.getHours()-8)+"小时"+po.getMinutes()+"分"+po.getSeconds()+"秒");
    
        }
        
        function showMessage(datetimeNow, stringUser , stringMessage,eid) {
            $(template.render('chatitem', { now: datetimeNow, user: stringUser, group: stringGroup, msg: stringMessage,eid:edi }))
                .text($("#event"+eid +" .replytext"))
                .fadeIn();

            var e = $("#event"+eid +"").parent();

            var nt=e.offset().top-e.parent().offset().top-16;
            $("#events").parent().animate({ scrollTop: nt }, 1000);
        }

        function updateStatus(Now, IsReady, Status) {
            var t = "";
            var s = 0; var c = 0;
            if (!IsReady) {
                t = "未开始";
                s = 0;
            } else {
                s = 1;
                c = Status;
                if (Status == 0) {
                    t = "已停止";
                } else if (Status == 1) {
                    t = "已暂停";
                } else if (Status == 2) {
                    t = "进行中";
                }
            }
            $("#playstatus").text("["+t+"]");
            if (IsReady) {
                $('#controller').slideDown('slow');
            } else {
                $('#controller').slideUp('slow');
            }
        }
        function updateeval(){
            $("#calcpoint a").click();
        }

        function updateSummary(data,a,b,c,d,e){
            var result=data.responseJSON;
            $("#Summary").text("无效"+result.vc0+"个，占"+result.vp0+"%； 合格"+result.vc1+"个，占"+result.vp1+"%；优秀"+result.vc2+"个，占"+result.vp2+"%；");
        }
    </script>


    <script id="chatitem" type="text/html">
        <strong><%=now%> <%=user%></strong><br />
        <%=msg%> 
    </script>
   
    <style type="text/css">
        #events td
        {
            vertical-align:top;

        }
        #events label
        {
            font-weight:bold;
            font-size:medium;
        }
    </style>
}

<section style="float: left; width: 100%; min-height: 400px">
    <section id="menuol" class="bg-white" style="max-height: 600px; overflow: auto; float: right; width: 100%; margin-right: 4px;">
        <table style="width:100%"><tr><td align="left"><h3 style="width:50%">学员总成绩:<span id="Summary"></span></h3></td><td align="right"><div id="calcpoint" class="button small" style="float:right;"> @Ajax.ActionLink("计算成绩", "Summary", new AjaxOptions { UpdateTargetId="Summary",HttpMethod="Post",OnComplete="updateSummary"})</div></td></tr></table>
        

        <div id="events" style="padding: 4px; border-bottom: 1px solid #fa6800;">
            @foreach (var item in Model.SceneList.Where(v=>v.Model.TargetGroup.Contains(ScenariosUser.GroupKey)).OrderBy(v => v.Model.SortIndex))
            {
                var itemidn = item.Model.ID.ToString("N");
                var reply = Model.Messages.FirstOrDefault(v => v.TargetEventID == itemidn && v.MsgType=="submit");
                var replytext = reply == null ? "" : reply.Content;
                var replypoint = item.Evaluation == null ? "" : (item.Evaluation.ValuePoint> 0 ? "答案有效" : "答案无效");
                <div id="e@(item.Model.SortIndex)">
                    <table style="width:100%;border:1px solid #fa6800;" data-eventid="@itemidn" id="event@(itemidn)">
                        <tr>
                            <td style="width:30%;border:1px solid #fa6800; ">
                                <div style="padding: 4px;">
                                    <div style="font-weight: bold">
                                        <span title="序号">@item.Model.SortIndex</span>,
                                        <span title="注入时间">@TimeSpan.FromSeconds(item.Model.OffsetSec).ToString()</span>,
                                        <span title="信息来源">@item.Model.Source</span>,
                                        <span title="类别">@item.Model.EventType</span>,                        
                                        <span title="目标分组">@item.Model.TargetGroup</span>,                        
                                        <span title="注入方式">@item.Model.InectType</span>
                                    </div>
                                    <div>
                                        <span>&nbsp;&nbsp;&nbsp;&nbsp; @item.Model.Title</span>
                                    </div>
                                </div>
                            </td>
                            <td style="width:25%;border:1px solid #fa6800;"><label>预期答案：</label>
                                @item.Model.ExpectResponse
                            </td>
                            <td  style="width:25%;border:1px solid #fa6800;"><label>学员答案：</label>
                                <div class="replytext">
                                    @replytext
                                </div>
                            </td>
                            <td style="width:10%">
                                <label>答案得分：</label><br />
                                <span id="rp@(itemidn)" class="replypoint">@(replypoint)</span>
                            </td>
                            <td style="width:10%;border:1px solid #fa6800;white-space:nowrap;">
                                <div class="button tiny bg-gray">@Ajax.ActionLink("无效", null, new { eventid = itemidn, value = 0,valuetitle="答案无效" }, new AjaxOptions { UpdateTargetId = "rp"+itemidn, HttpMethod = "Post", OnComplete="updateeval();"})</div>
                                <div class="button tiny">@Ajax.ActionLink("合格", null, new { eventid = itemidn, value = 1,valuetitle="答案合格" }, new AjaxOptions { UpdateTargetId = "rp"+itemidn, HttpMethod = "Post", OnComplete="updateeval();" })</div>
                                <div class="button tiny bg-cyan">@Ajax.ActionLink("优秀", null, new { eventid = itemidn, value = 2,valuetitle="答案优秀" }, new AjaxOptions { UpdateTargetId = "rp"+itemidn, HttpMethod = "Post", OnComplete="updateeval();" })</div>
                            </td>
                        </tr>
                    </table>
                </div>
            }
        </div>
        @Html.ActionLink("评价完成", "Summary")

    </section>
</section>
